<template>
	<qs-page class="u-padding-20">
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
		     <!--isFullScreen 可以实其全屏显示-->
		<ourLoading isFullScreen :active="loadstatus" :text="loadstxt" color="#ffcc00" textColor="#ffcc00"/>
		<view class="u-padding-20 " v-if="!hasLogin" >
			<u-empty text="请先登陆" mode="permission"></u-empty>
		</view>
		<view class="wallet-panel-box u-m-b-30">
			<view class="bg">
				<view class="wdzc">
					<u-row gutter="0" justify="center">
						<u-col span="7">
							我的资产
						</u-col>
						<u-col span="5" text-align="right">
							<i><u-icon name="yonghuxinxi" custom-prefix="customicon" size="30"></u-icon></i>
							<text class="u-font-sm">资产安全保障中</text>
						</u-col>
					</u-row>
					<u-row gutter="0" justify="center">
						<u-col span="12">
							<h3 class="u-padding-20">≈ {{coin_list.totalassets}} CNY</h3>
						</u-col>
					</u-row>
				</view>
				<view class="wdcz">
					<u-row gutter="16" justify="center">
						<u-col span="4" text-align="center" @click="$tools.routerTo('/pages/my/assets/congcoin')">
							收款
						</u-col>
						<u-col span="4" text-align="center" @click="$tools.routerTo('/pages/my/assets/zhuancoin_1')"><!--,'selectList='+JSON.stringify(selectList))-->
							转帐
						</u-col>
						<u-col span="4" text-align="center" @click="$tools.routerTo('/pages/my/assets/ticoin')">
							提币
						</u-col>
					</u-row>
				</view>
			</view>
		</view>
		
		<view class=" base-panel-box">
		<view class="htitle">
				<view class="u-font-sm">
					<i><u-icon name="yonghuxinxi" custom-prefix="customicon" size="30"></u-icon></i>
					我的资产
					</view>
		</view>
		<view class="item"  v-for="(item, index) in coin_list.list" :key="index"
			@click="$Router.push({path:'/pages/my/assets/flowlist',query:{id:item.id,name:item.name}})">
		<u-row gutter="0" justify="space-between"  >
			<u-col span="2">
				<image :src="item.icons" mode="aspectFill" style="width: 100rpx;height: 100rpx;"/>
			</u-col>
			<u-col span="8">
				<view class="demo-layout bg-purple-light">
					<h4>{{item.name}}</h4>
					<text>{{item.balance_total}} {{item.unit}}</text>
				</view>
			</u-col>
			<u-col span="2"  text-align="right">
				<u-icon name="arrow-right" color="#969799" size="28"></u-icon>
			</u-col>
		</u-row>
		</view>
		</view>

	</qs-page>
</template>

<script>
	import {mapState,mapMutations} from 'vuex';
export default {
	data() {
		return {
			title:{
				'font-size':'38rpx'
			},
			coin_list:{},
			hasLogin:false,
			loadStatus: 'loadmore',
			loadstatus:false,
			loadstxt:'loading...',
		};
	},
	computed: {
	  ...mapState(['user']),
	},
	async onLoad(){
		this.hasLogin=this.$store.getters.loginFlag;
		let flag = await this.getcoin();
	},
	methods: {
		getcoin(){
                return new Promise((resolve, reject) => {
					this.loadstatus=true;
                    this.$api('assets.coin_list', {}).then(res => {
						if (res.code==200){
							this.coin_list=res.data;
						}
						resolve(true);
						this.loadstatus=false;
                    }).catch((e)=>{
						this.loadstatus=false;
                        resolve(false);
                    });
                })
		},
	}
};
</script>

<style lang="scss">
	.wallet-panel-box{
		background: linear-gradient(109.34deg, #1589D9 6.3%, #62D8E6 99.92%);
		color: #FFFFFF;
		border-radius: 20rpx;
		.bg{
			height: 230rpx;
		background: url(@/static/indexbg.png) no-repeat top right;
		background-size:auto 100%;
		-o-background-size: auto  100%;
		-webkit-background-size: auto  100%;
		background-position:right 0rpx;
		.wdzc{
			padding: 20rpx;
			height: 160rpx;
			border-bottom:1px solid rgba(255, 255, 255, 0.2)
		}
		.wdcz{padding-top: 14rpx;}
		}
	}
</style>
